/**
 * PlayvideoItem
 */

 import consts from "../../../../../consts/consts";
 import storage from "../../../../../utils/storage";
 import React,{Component}from "react";

 class PlayvideoItem extends Component{
    handleOnChangeVideo(){
        const {data} = this.props;
//        if(data.action.type == consts.WIDGET_TYPE.VIDEO_EXT){
//            root.setState({
//                is_play_video : true,
//            })
//        } else storage.data.is_edit_video = true;
//        
//        root.openDialog(consts.WIDGET_TYPE.VIDEO);
        console.log("open dialog");
    }
    render(){
        const {data} = this.props;
        let src = data.action.url || data.action.html;

        let vStyle = {
            width:  "198px",
            marginTop: "20px"
        };

        return (
            <div>
                <div className="details-item">
                    <video src={src} ref="video" style={vStyle} preload="metadata" className="video-js vjs-default-skin">
                        <source src={src} />
                    </video>
                </div>
                <div className="details-item">
                    <button disabled={data.readOnly} onClick={() => this.handleOnChangeVideo()}>{$._("Replace")}{$._("Video")}</button>
                </div>
            </div>
        )
    }
 }

 module.exports = PlayvideoItem;
